/*
 * Copyright (c) 2025 Huawei Device Co., Ltd.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import React, {useState, useEffect} from 'react';
import {
  SafeAreaView,
  ScrollView,
  StyleSheet,
  Text,
  Image,
  Button,
} from 'react-native';
import {MediaProcessing} from '@hadss/react_native_media_processing';
import {uriBase64} from './image';

function App(): JSX.Element {
  const [prevUri, setPrevUri] = useState('');
  const [afterUri, setAfterUri] = useState('');

  useEffect(() => {
    MediaProcessing.init();
    return () => {
      MediaProcessing.deinit();
    };
  }, []);

  const enhance = async (uri: string): Promise<void> => {
    setPrevUri(uri);
    const descBase64 = await MediaProcessing.enhanceDetail(uri, 1080, 1080);
    setAfterUri(descBase64 ?? '');
  };

  const onPressHttp = async (): Promise<void> => {
    await enhance(
      'https://img1.baidu.com/it/u=3287470634,1888300445&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=667',
    );
  };

  const onPressBase64 = async (): Promise<void> => {
    await enhance(uriBase64);
  };

  const onPressFile = async (): Promise<void> => {
    await enhance(
      'file://com.hadss.ohFeature/data/storage/el2/base/haps/entry/files/resfile/rose.png',
    );
  };

  return (
    <SafeAreaView>
      <ScrollView contentInsetAdjustmentBehavior="automatic">
        <Button onPress={onPressHttp} title="Http图片" />
        <Button onPress={onPressBase64} title="Base64图片" />
        <Button onPress={onPressFile} title="文件图片" />
        <Text>增强前：</Text>
        <Image
          style={styles.img}
          source={{
            uri: prevUri,
          }}
        />
        <Text>增强后：</Text>
        <Image
          style={styles.imgout}
          source={{
            uri: afterUri,
          }}
        />
      </ScrollView>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  img: {
    width: 500,
    height: 500,
  },
  imgout: {
    width: 600,
    height: 500,
  },
});

export default App;
